<template>
    <div class="teamplate-system">
        <div class="container-fluid">
            <div class="row">
                <ul class="setup-list">
                    <li class="item">
                        <div class="title">业务设置</div>
                        <div class="bd">
                            <div class="row">
                                <div class="col-lg-4 col-md-4">
                                    <div class="form-group">
                                        <label class="radio-label">是否允许负库存</label>
                                        <label class="radio-inline">
                                            <input type="radio" name="r1" :checked="setConfig.kucun==1" :value="valueTrue" :data-keyword='kucun' @change="onStock(kucun,valueTrue)"> 是
                                        </label>
                                        <label class="radio-inline">
                                            <input type="radio" name="r1" :checked="setConfig.kucun==0" :value="valueFalse" :data-keyword='kucun' @change="onStock(kucun,valueFalse)"> 否
                                        </label>
                                    </div>
                                </div>
                                <div class="col-lg-4 form-inline col-md-4">
                                    <div class="form-group">
                                        <label class="radio-label">允许退货</label>
                                        <label class="radio-inline">
                                            <input type="radio" name="r2" :checked="setConfig.tuihuo==1" :value="valueTrue" :data-keyword='tuihuo' @change="onStock(tuihuo,valueTrue)"> 是
                                        </label>
                                        <label class="radio-inline">
                                            <input type="radio" name="r2" :checked="setConfig.tuihuo==0" :value="valueFalse" :data-keyword='tuihuo' @change="onStock(tuihuo,valueFalse)"> 否
                                        </label>
                                    </div>
                                </div>
                                <div class="col-lg-4 form-inline col-md-4">
                                    <div class="form-group">
                                        <label class="radio-label">是否自动提交</label>
                                        <label class="radio-inline">
                                            <input type="radio" name="r3" :checked="setConfig.tijiao==1" :value="valueTrue" :data-keyword='tijiao' @change="onStock(tijiao,valueTrue)"> 是
                                        </label>
                                        <label class="radio-inline">
                                            <input type="radio" name="r3" :checked="setConfig.tijiao==0" v:value="valueFalse" :data-keyword='tijiao' @change="onStock(tijiao,valueFalse)"> 否
                                        </label>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-lg-4 form-inline col-md-4">
                                    <div class="form-group">
                                        <label class="radio-label">最低折扣率</label>
                                        <div class="input-group">
                                            <input type="number" class="form-control texts" min="0" v-model="setConfig.koulv">
                                            <span class="input-group-addon" @click="onStock(koulv,setConfig.koulv)">确认</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-4 form-inline col-md-4">
                                    <div class="form-group">
                                        <label class="radio-label">整单扣率</label>
                                        <div class="input-group">
                                            <input type="number" class="form-control texts" min="0" :readonly='adminid' v-model="setConfig.zdkoul">
                                            <span class="input-group-addon" @click="onZdkoul">确认</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-4 form-inline col-md-4">
                                    <div class="form-group">
                                        <label class="radio-label">会员初始扣率</label>
                                        <div class="input-group">
                                            <input type="number" class="form-control texts" min="0" v-model="setConfig.initialKoul">
                                            <span class="input-group-addon" @click="onInitialKoul">确认</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </li>
                    <li class="item i3">
                        <div class="title">打印机</div>
                        <div class="bd">
                            <div class="row">
                                <form action="">
                                    <ul class="col-lg-4 form-inline col-md-4">
                                        <li>
                                            <div class="form-group">
                                                <label class="">默认小票机驱动</label>
                                                <select name="" class="form-control" id="select1" style="width:200px;"></select>
                                            </div>
                                            <span v-if="msg" class="red">未安装打印驱动无法设置</span>
                                        </li>
                                        <li>
                                            <div class="form-group">
                                                <label class="">设置其它打印机</label>
                                                <select name="" class="form-control" id="select3" style="width:200px;"></select>
                                            </div>
                                            <span v-if="msg" class="red">未安装打印驱动无法设置</span>
                                        </li>
                                        <li>
                                            <div class="form-group">
                                                <label class="">小票格式</label>
                                                <select name="" class="form-control" id="select4" style="width:200px;">
                                                    <option>普通零售</option>
                                                    <option>医药零售</option>
                                                </select>
                                            </div>
                                        </li>
                                        <li><input type="button" class="btn" id="j_confirm" value="确认" @click="onConfirm"></li>
                                    </ul>
                                </form>
                                <div class="col-lg-8 hide">
                                    <div id="j_itemText" class="format">
                                        <p>【开心人大药房-收银凭条】</p>
                                        <p>日期:2016-06-05 </p>
                                        <p>时间:17:18:36 </p>
                                        <p>收银员:收银员 </p>
                                        <p>流水号:01000000006</p>
                                        <p>会员名: 积分:0.0 </p>
                                        <p>--------------------------------</p>
                                        <p>商品名称</p>
                                        <p>零售价/会员价 数量 金额</p>
                                        <p> 批号 产地 规格</p>
                                        <p>--------------------------------</p>
                                        <p>*氨酚伪麻美芬片II</p>
                                        <p>16.5/16.5 1 16.5</p>
                                        <p> 拜耳医药保健 16片日片</p>
                                        <p>--------------------------------</p>
                                        <p>收款金额:16.5 </p>
                                        <p>实收金额:16.5 收讫:现金</p>
                                        <p>找零金额:0.0 </p>
                                        <p>会员优惠:0.0</p>
                                        <p>--------------------------------</p>
                                        <p>〔非质量问题，概不退换！〕</p>
                                        <p>*为运动员慎用，*#为含麻类商品</p>
                                        <p>祝您购物愉快！</p>
                                        <p>地址:浦东新区博兴路342-352号</p>
                                        <p>电话:021-50351528 </p>
                                        <p>--------------------------------</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </li>
                    <li class="item i3">
                        <div class="title">会员扣率</div>
                        <div class="bd">
                            <div class="row">
                               <div class="list-table">
                                    <div class="list-h">
                                        <div class="btn-group">
                                            <span  @click="onAdd"><i class="iconfont icon-jiahao"></i> 添加会员扣率</span>
                                        </div>
                                    </div>
                                    <div class="table-wrap row ">
                                        <div class="table-box col-lg-8 col-md-8" >
                                            <table class="table table-striped add table-bordered" >
                                                <thead >
                                                    <tr>
                                                        <th style="text-align:left;">初始累计消费</th>
                                                        <th style="text-align:left;">会员扣率</th>
                                                        <th style="text-align:left;">等级</th>
                                                        <th style="text-align:center;">删除会员扣率</th>
                                                        <!-- <th style="text-align:center;">编辑会员扣率</th> -->
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    <tr v-for="(item,index) in koulvguize">
                                                        <td><input v-if="index!=0" type="text" placeholder="请输入初始累计消费" class="star"   :id="'start'+index"  style="border:none;width:100px;" v-model="item.start" /><input v-if="index==0" type="text" :value="0" class="star" :readonly="true"  :id="'start'+index"  style="border:none;width:100px;"  /></td>
                                                        <td><input type="text" placeholder="请输入会员扣率" class="koulv" :id="'koulv'+index" style="border:none;width:100px;" v-model="item.koulv" /></td>
                                                        <td><input type="text" placeholder="请输入会员等级" class="sign" :id="'sign'+index" style="border:none;width:100px;" v-model="item.sign" /></td>
                                                        <td class="tc" @click="delete1(item.id)"><i class="iconfont icon-jianhao"></i></td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                         <div class="table-box col-lg-4 col-md-4" >
                                            <!-- <div style="color:red">注:请不要添加太多会员扣率规则</div> -->
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-lg-12">
                                             <input type="button" class="btn" value="保存会员扣率" @click="onPreservation">
                                             <input type="button" class="btn" value="更新会员扣率" @click="onUpdateMembers">
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>

        </div>
    </div>
</template>
<script>
    export default {
        components: {},
        data() {
            return {
                setConfig: {
                    //配置信息（库存，扣率，自动结算）
                    kucun: {},
                    tuihuo: {},
                    tijiao: {},
                    koulv: {},
                    zdkoul: '',
                    initialKoul: ''
                },
                valueTrue: "1",
                valueFalse: "0",
                kucun: "NEGATIVE_INVENTORY",
                tuihuo: "RETURNED_GOODS",
                tijiao: "AUTOCOMMIT",
                koulv: "LOWEST_KOULV",
                fdbs: "",
                fdId: "",
                msg: true,
                adminid: true,
                koulvguize: [],
                preservationHuiYuan: false,
                num: '',
                addling: false,
                addHtml: ``
            };
        },
        watch: {},
        methods: {
            onStock(res, val) {
                //修改设置
                let me = this;
                let parameter = {
                    configName: res,
                    sktid: localStorage.getItem("sktId"),
                    value: val,
                    fdbs: me.fdbs
                };
                me.service.updateSystemConfigByName(me, parameter, data => {
                    layer.alert(data.message);
                });
            },
            onConfirm(e) {
                let me = this;
                let datas = {};
                datas.drive = $("#select1 option:selected").text();
                datas.other = $("#select3 option:selected").text();
                datas.format = $("#select4 option:selected").text();
                localStorage.removeItem("config");
                localStorage.setItem("config", JSON.stringify(datas));
                layer.alert("设置成功");
            },
            onZdkoul() {
                //修改整单扣率
                let me = this;
                if (me.setConfig.zdkoul >= me.setConfig.koulv) {
                    me.service.updateAllKouL(me);
                } else {
                    layer.alert("整单扣率不能低于最低扣率");
                }
            },
            onInitialKoul() { //修改会员初始扣率
                let me = this;
                let res = {
                    huiYuanKoulv: me.setConfig.initialKoul,
                    fdbs: me.fdbs
                }
                if (me.setConfig.initialKoul < 0) {
                    layer.alert("整单扣率不能低于最低扣率");
                } else if (me.setConfig.initialKoul > 100) {
                    layer.alert("整单扣率不能大于最低扣率");
                } else {
                    me.service.updateHuiyuanKoulv(me, res, data => {
                        layer.alert(data.message);
                    })
                }
            },
            onAdd(e) {
                let me = this;
                let addHtml = `<tr class="addHuiyuan">
                    <td><input type="text" placeholder="请输入初始累计消费" class="star" style="border:none;width:100px;"/></td>
                    <td><input type="text" placeholder="请输入会员扣率" class="koulv"  style="border:none;width:100px;"/></td>
                    <td><input type="text" placeholder="请输入会员等级" class="sign" style="border:none;width:100px;"/></td>
                    <td class="shanchu tc" ><i class="iconfont icon-jianhao"></i></td>
                    </tr>`;
                $(".add").find("tbody").append(addHtml);
                if (me.addling) {
                    $(".star").val('0');
                    $('.star').attr('readonly', 'true');
                    me.addling = false;
                }
            },
            delete1(id) {
                //删除会员扣率
                let me = this;
                //根据会员id删除会员扣率规则
                //询问框
                layer.confirm(
                    "您确定要删除么？", {
                        btn: ["是", "否"]
                    },
                    function() {
                        var parms = {
                            id: id,
                            fdbs: me.fdbs
                        }
                        me.publics.deleteHYKoulvById(me, parms, data => {
                            console.log(data);
                            if (data.code = 200) {
                                layer.msg("已经成功删除记录" + id, {
                                    icon: 5
                                });
                            }
                            me.publics.selectHYKoulv(me, data => {
                                console.log("===会员扣率规则===");
                                console.log(data);
                                if (data.code = 200) {
                                    console.log("===会员扣率规则===");
                                    console.log(data);
                                    if ((data.code = 200)) {
                                        me.koulvguize = data.data;
                                    }
                                }
                            })
                        })
                    }
                );
            },
            onPreservation(e) { //保存扣率修改
                let me = this;
                let star = $('.star');
                let koulv = $('.koulv');
                let sign = $('.sign');
                let starVal = [];
                let koulvVal = [];
                let nums1 = [];
                let sortSort = [];
                let koulvSort = [];
                let res = [];

                if (star.length > 0) {
                    for (let i = 0; i < star.length; i++) {
                        if (star[i].value == '') {
                            layer.open({
                                content: '初始累计消费不能为空',
                                yes: function(index, layero) {
                                    layer.close(index);
                                    $(star[i]).focus().select();
                                }
                            });
                            return false;
                        }
                        if (!me.util.string.integer(parseFloat(star[i].value))) {
                            layer.open({
                                content: '初始累计消费须为正整数',
                                yes: function(index, layero) {
                                    layer.close(index);
                                    $(star[i]).focus().select();
                                }
                            });
                            return false;
                        }
                        if (koulv[i].value == '') {
                            layer.open({
                                content: '会员扣率不能为空',
                                yes: function(index, layero) {
                                    layer.close(index);
                                    $(koulv[i]).focus().select();
                                }
                            });
                            return false;
                        }
                        if (!me.util.string.integer(parseFloat(koulv[i].value))) {
                            layer.open({
                                content: '会员扣率须为正整数',
                                yes: function(index, layero) {
                                    layer.close(index);
                                    $(koulv[i]).focus().select();
                                }
                            });
                            return false;
                        }
                        if (koulv[i].value > 100) {
                            layer.open({
                                content: '会员扣率不能大于100',
                                yes: function(index, layero) {
                                    layer.close(index);
                                    $(koulv[i]).focus().select();
                                }
                            });
                            return false;
                        }
                        if (koulv[i].value < 0) {
                            layer.open({
                                content: '会员扣率不能小于0',
                                yes: function(index, layero) {
                                    layer.close(index);
                                    $(koulv[i]).focus().select();
                                }
                            });
                            return false;
                        }
                        if (sign[i].value.length > 8) {
                            layer.open({
                                content: '会员等级不能超过8个汉字',
                                yes: function(index, layero) {
                                    layer.close(index);
                                    $(sign[i]).focus().select();
                                }
                            });
                            return false;
                        }
                        starVal.push(star[i].value);
                        koulvVal.push(koulv[i].value);
                        nums1.push(star[i].value);
                        let endVariable = 0;
                        if (i == star.length - 1) {
                            endVariable = 100000000;
                        } else {
                            endVariable = star[i + 1].value;
                        }
                        res.push({
                            start: star[i].value,
                            end: endVariable,
                            koulv: koulv[i].value,
                            sign: sign[i].value
                        });
                    }
                    sortSort = nums1.sort((a, b) => {
                        return a - b;
                    });
                    if (starVal.length == sortSort.length) {
                        for (let i = 0; i < starVal.length; i++) {
                            if (starVal[i] != sortSort[i]) {
                                layer.alert("初始累计消费不合法");
                                return false;
                            }
                            if (koulvVal[i + 1] > koulvVal[i]) {
                                layer.alert("会员扣率不合法");
                                return false;
                            }
                        }
                    }
                    let obj = {
                        HuiyuanKoulvList: JSON.stringify(res),
                        fdbs: me.fdbs
                    }
                    me.service.insertHYKoulv(me, obj, data => {
                        layer.alert(data.message);
                    })
                } else {
                    layer.alert('没有需保存的数据')
                }
            },
            onUpdateMembers(e) {
                let me = this;
                let res = {
                    fdbs: me.fdbs
                }
                me.service.updateHYKoulvByFdbs(me, res)
            },
            onSelectHYKoulv(e) { //查询会员扣率规则
                let me = this;
                me.publics.selectHYKoulv(me, data => {
                    console.log("===会员扣率规则===");
                    console.log(data);
                    if ((data.code = 200)) {
                        me.koulvguize = data.data;
                        if (data.data.length == 0) {
                            me.addling = true;
                        }
                    }
                });
            }
        },
        mounted() {
            let me = this;
            me.fdbs = localStorage.getItem("fdbs");
            console.log(me.fdbs);
            let user = JSON.parse(sessionStorage.getItem("user"));
            if (!user) {
                router.push({
                    path: "/login"
                });
                return;
            }

            me.onSelectHYKoulv();

            me.service.selectHuiyuanKoulv(me, data => {
                me.setConfig.initialKoul = data.data
            })

            setTimeout(function() {
                let LODOP;
                (function() {
                    LODOP = getLodop();
                    if (LODOP) {
                        let iPrinterCount = LODOP.GET_PRINTER_COUNT();
                        me.msg = false;
                        let config = JSON.parse(localStorage.getItem("config"));

                        for (let i = 0; i < iPrinterCount; i++) {
                            let option;
                            option = '<option value="' + i + '">' + LODOP.GET_PRINTER_NAME(i) + "</option>";
                            $("#select1").append(option);
                            $("#select3").append(option);
                        }
                        if (config) {
                            $("#select1")
                                .find("option")
                                .each(function(index, item) {
                                    let o = $(this);
                                    if (config.drive == o.text()) {
                                        o.attr("selected", true);
                                    }
                                });

                            $("#select3")
                                .find("option")
                                .each(function(index, item) {
                                    let o = $(this);
                                    console.log(o);
                                    if (config.other == o.text()) {
                                        o.attr("selected", true);
                                    }
                                });

                            $("#select4")
                                .find("option")
                                .each(function(index, item) {
                                    let o = $(this);
                                    console.log(o);
                                    if (config.format == o.text()) {
                                        o.attr("selected", true);
                                    }
                                });
                        }
                    }
                })();
            }, 500);
            let fdbsPromise = new Promise((resolve, reject) => {
                //分店标识
                $.ajax({
                    type: "GET",
                    url: me.cfg.api + "/ls/selectFdbs",
                    dataType: "json"
                }).done(data => {
                    resolve(data);
                });
            }).then(resolve => {
                if (resolve.code == 200) {
                    me.fdbs = resolve.data.fdbs;
                    me.fdId = resolve.data.id;
                    me.setConfig.zdkoul = resolve.data.allKouL;
                    if (resolve.data.adminid == user.shkyid) {
                        me.adminid = false;
                    } else {
                        me.adminid = true;
                    }
                }
            }).then(() => {
                //获取配置信息（库存，扣率，自动结算）
                me.service.selectSystemConfigList(me);
            });
            $('.table-wrap').on('click', 'tbody .shanchu .iconfont', (e) => {
                let o = $(event.target);
                o.parents('tr').remove();
            })
        }
    };
</script>
<style>
    .table-striped>tbody>tr:nth-of-type(odd) {
        background-color: #ffffff;
    }
</style>